<!DOCTYPE html>
<html>

{include file='public/header'}
<style>
    .layui-inline{
        margin-bottom: 5px;
    }
    .layui-input-block{
        margin-left: 0px;
    }
    .layui-input{
        width: 200px;
    }
    .layui-table-page{
        display: none;
    }
    .layui-table-view{
        margin-top: 0!important;
    }
</style>
<body>
    <table id="getTaskVideo" lay-filter="getTaskVideo"></table>
    <div class="layui-btn-group">
        <button type="button" id="up" class="layui-btn layui-btn-primary layui-btn-sm layui-btn-disabled" onclick="getData('up')">上一页</button>
        <button type="button" id="next" class="layui-btn  layui-btn-primary layui-btn-sm layui-btn-disabled" onclick="getData('next')">下一页</button>
    </div>
    <script>
        let id = GetQueryString('id')
        let TaskId = GetQueryString('TaskId')
        let start_time = GetQueryString('start_time')
        let end_time = GetQueryString('end_time')
        let page = 1;
        let params = {
            elem: '#getTaskVideo'
            , toolbar: false
            , url: '/admin/tiktok/getTaskVideoData' //数据接口
            , id: 'getTaskVideo'
            , page: {
                curr:page,
            }
            , where:{
                task_ids:TaskId,
                id,
                start_time,
                end_time
            }
            , limit:15
            , cols: [[ //表头
                { field: 'MicroAppTitle', title: '小程序名称',align:'center' }
                , { field: 'PublishTime', title: '发布时间', align:'center', width:160, templet: function (d) {
                            return dayjsFormat(d.PublishTime)
                        }
                     }
                , { field: 'TaskId', title: '任务ID', width:185, align:'center' }
                , { field: 'TaskName', title: '任务名', width:200, align:'center' }
                , { field: 'VideoId', title: '视频ID', width:180,align:'center' }
                , { field: 'Author', title: '作者', width:135,align:'center' }
                , { field: 'DouyinID', title: '达人抖音ID', width:125,align:'center' }
                , { field: 'VideoLink', title: '视频链接', width:165,align:'center' }
                , { field: 'VideoTitle', title: '视频标题', width:165,align:'center' }
                , { field: 'Clicks', title: '组件点击数<i class="layui-icon iconfont icon-lytishi1" id="Clicks"></i>', width:120,align:'center' }
                , { field: 'VideoViews', title: '播放量',align:'center' }
                , { field: 'Comments', title: '评论量',align:'center' }
                , { field: 'Likes', title: '点赞量',align:'center' }
                , { field: 'Shares', title: '分享量',align:'center' }
                , { field: 'ActiveCntTd', title: '有效日活用户数<i class="layui-icon iconfont icon-lytishi1" id="ActiveCntTd"></i>' , width:175,align:'center' }
                , { field: 'GMVTd', title: '总交易金额<i class="layui-icon iconfont icon-lytishi1" id="GMVTd"></i>', width:130,align:'center' }
                , { field: 'AdShareCostTd', title: '广告收入<i class="layui-icon iconfont icon-lytishi1" id="AdShareCostTd"></i>',align:'center' }
                , { field: 'BillingGMVTd', title: '交易金额<i class="layui-icon iconfont icon-lytishi1" id="BillingGMVTd"></i>', width:135,align:'center' }
                , { field: 'BillingRefundGMVTd', title: '任务关联的累计退款金额<i class="layui-icon iconfont icon-lytishi1" id="BillingRefundGMVTd"></i>', width:200,align:'center' }
                , { field: 'ClientName', title: '撮合中介名称<i class="layui-icon iconfont icon-lytishi1" id="ClientName"></i>', width:135,align:'center' }
                , { field: 'ExpectedProfit', title: '当日达人佣金', width:125,align:'center' }
                , { field: 'FeedAdShareCostTd', title: 'feed流广告收入<i class="layui-icon iconfont icon-lytishi1" id="FeedAdShareCostTd"></i>', width:145,align:'center' }
                , { field: 'RefundGMVTd', title: '累计退款金额<i class="layui-icon iconfont icon-lytishi1" id="RefundGMVTd"></i>', width:160,align:'center' }
            ]]
            ,done: function(res, curr, count){
                tips('#ActiveCntTd','#ActiveCntTd','任务关联的有效日活用户数。仅按日活用户计费的任务视频有值')
                tips('#AdShareCostTd','#AdShareCostTd','从视频进入小程序产生的广告收入（平台抽成后的开发者可分成收入，未扣除买量消耗），单位：分')
                tips('#BillingGMVTd','#BillingGMVTd','任务关联的交易金额，单位：分。 即根据任务计费规则可以归因到这个视频，并给达人分佣的交易金额。仅支付分成的任务视频有值')
                tips('#BillingRefundGMVTd','#BillingRefundGMVTd','任务关联的交易金额中，累计退款金额，单位：分。即根据任务计费规则可以归因到这个视频，并给达人分佣的交易金额（已退款）。仅支付分成的任务视频有值')
                tips('#ClientName','#ClientName','撮合中介，可归因到的撮合中介的应用名称。若不归属于任何一个撮合中介，则为空')
                tips('#FeedAdShareCostTd','#FeedAdShareCostTd','从feed流看到视频，并进入小程序产生的广告收入（平台抽成后的开发者可分成收入，未扣除买量消耗），单位：分')
                tips('#RefundGMVTd','#RefundGMVTd','从视频进入小程序产生的交易金额中，累计退款金额，单位：分')
                tips('#GMVTd','#GMVTd','从视频进入小程序产生的总交易金额，单位：分')
                tips('#Clicks','#Clicks','组件点击数（延迟2天）')

                if(res.data.length == 15){
                    $("#next").removeClass('layui-btn-disabled')
                }
                if(page == 1){
                    $("#up").addClass('layui-btn-disabled')
                }
                if(res.data.length != 15 && page != 1){
                    $("#next").addClass('layui-btn-disabled')
                }
            }
            ,parseData:function (res) { //res 即为原始返回的数据
                if(res.code == 200){
                    return {
                        "data": res.data, //解析数据列表
                        "code": res.code, //解析接口状态
                        'count':0//解析数据长度
                    };
                }else{
                    layer.msg(res.message,{icon:5,time:1000});
                    return {
                        "data": [], //解析数据列表
                        "code": 200, //解析接口状态
                        'count':0//解析数据长度
                    };
                }
            },
        }
        tableList(params)
        
        function getData(type){
            if($('#'+type).hasClass('layui-btn-disabled')) return;
            if(type == 'up'){
                $("#next").removeClass('layui-btn-disabled')
                page --;
            }else{
                $("#up").removeClass('layui-btn-disabled')
                page ++
            }
            params.page.curr = page;
            tableList(params)
        }
    </script>
</body>

</html>